<!--
		checkBox的全选, 反选, 全不选的练习
-->

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
</head>

<body>
<input type="checkbox" name="allornot" id="all" onClick="selectalloroff();"/>
全选/全不选 <br/>
<input type="checkbox" name="hobby" id="all"/>
篮球
<input type="checkbox" name="hobby" id="volleyball"/>
排球
<input type="checkbox" name="hobby" id="badminton"/>
羽毛球
<input type="checkbox" name="hobby" id="pingpong"/>
乒乓球 <br/>
<input type="button" id="btnselall" value="全选" onClick="selectall();"/>
<input type="button" id="btnselallnot" value="全不选" onClick="selectallnot();"/>
<input type="button" id="btnselinverse" value="反选" onClick="selectinverse();"/>
</body>
<script type="text/javascript">

		function selectalloroff(){
			var tempcheckbox = document.getElementById("all");
			var istrue = tempcheckbox.checked;
			var checkboxarray = document.getElementsByName("hobby");
			for( var i=0; i < checkboxarray.length; i++ )
			{//check被点击的时候是先改变状态然后再触发onclick
				checkboxarray[i].checked = istrue;
			}	
		}
		function selectall(){
			var checkboxarray = document.getElementsByName("hobby");
			for( var i=0; i < checkboxarray.length; i++ )
			{
				checkboxarray[i].checked = true; //设置属性方法1
				//checkboxarray[i].setAttribute("checked",true);//设置属性方法2
			}	
		}
		function selectallnot(){
			var checkboxarray = document.getElementsByName("hobby");
			for( var i=0; i < checkboxarray.length; i++ )
			{
				checkboxarray[i].checked = false; //设置属性方法1
				//checkboxarray[i].setAttribute("checked",false);//设置属性方法2
			}			
		}
		function selectinverse(){	
			var checkboxarray = document.getElementsByName("hobby");
			for( var i=0; i < checkboxarray.length; i++ )
			{
				checkboxarray[i].checked = !(checkboxarray[i].checked); //取反
			}	
		}
	</script>
</html>
